<template>
    <img src="res/ui/ground2.png" :width="imgWidth" :height="imgHeight" grid="[7,7,7,7]"></img>
    <txt @bind="titleNode" :text="title" x="10" y="10" size="18" color="#ffffff"></txt>
    <txt @bind="descNode" :text="desc" x="10" y="40" size="14" color="#DDDDDD"></txt>
</template>

<script>
    init(){
        this.title= "标题";
        this.desc= "富文本提示框";
        this.imgNode= null;
        this.titleNode= null;
        this.descNode= null;
        this.imgWidth= 0;
        this.imgHeight= 0;
    }

    // watch() {
    //     return {
	// 	    title: "contentChange",
    //         desc: "contentChange"
    //     }
	// }

    create() {
        console.log("tip create");
    }

    update(delta) {
        this.contentChange();
    }

    destroyed() {

    }

    updateContent(title, desc) {
        this.title = title;
        this.desc = desc;
    }

    contentChange(){//边框改变
        this.imgWidth = 20 + (this.titleNode.width > this.descNode.width ? this.titleNode.width : this.descNode.width);
        this.imgHeight = 50 + (this.titleNode.height > this.descNode.height ? this.titleNode.height : this.descNode.height);
    }
</script>